<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jstl/core">
<head>
	<c:if test="#{not empty searchController.researcherName}">
			<script src="http://simile.mit.edu/timeline/api/timeline-api.js" type="text/javascript"></script>
			<script>
			<!--
function onLoad() {
  var eventSource = new Timeline.DefaultEventSource();
  var bandInfos = [
    Timeline.createBandInfo({
        eventSource:    eventSource,
        width:			100,
        trackHeight:	2.25,
        date:           "Oct 01 2007 00:00:00 GMT",
        width:          "80%", 
        intervalUnit:   Timeline.DateTime.MONTH, 
        intervalPixels: 50
    }),
    Timeline.createBandInfo({
        showEventText:  false,
        trackHeight:    0.6,
        trackGap:       0.3,
        eventSource:    eventSource,
        date:           "Oct 01 2007 00:00:00 GMT",
        width:          "20%", 
        intervalUnit:   Timeline.DateTime.YEAR, 
        intervalPixels: 100
    })
  ];
  bandInfos[1].syncWith = 0;
  bandInfos[1].highlight = true;
  
  tl = Timeline.create(document.getElementById("my-timeline"), bandInfos);
  Timeline.loadXML("#{facesContext.externalContext.requestContextPath}/servlet/PubsToEvents?name=#{searchController.researcherNameForLink}", function(xml, url) { eventSource.loadXML(xml, url); });
}
		//-->
		</script>
	</c:if>
</head>
<body onload="onLoad();">
<h:panelGroup rendered="#{not empty searchController.researcherName}">
<div id="my-timeline" style="height: 300px; border: 1px solid #aaa" />
</h:panelGroup>
</body>
</html>